<!doctype html>
<html style="height: auto; min-height: 100%;" lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"></meta>
    <meta http-equiv="Expires" content="0"></meta>
    <meta http-equiv="Cache-Control" content="no-cache"></meta>
    <meta http-equiv="Cache-Control" content="no-store"></meta>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0"></meta>
	<title>GGKB | Dashboard</title>
	<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
	<link rel="shortcut icon" th:href="@{/favicon.ico}" >
	<link rel="stylesheet" th:href="@{/css/bootstrap.min.css}">
	<link rel="stylesheet" th:href="@{/css/font-awesome.min.css}">
	<link rel="stylesheet" th:href="@{/css/plugins/layer/theme/default/layer.css}">
	<link rel="stylesheet" th:href="@{/css/ionicons.min.css}">
	<link rel="stylesheet" th:href="@{/css/home.css}">
	<link rel="stylesheet" th:href="@{/css/tabstyle.css}">
	<link rel="stylesheet" th:href="@{/css/font-icons.min.css}">
</head>
<body class="skin-blue sidebar-mini" style="height: auto; min-height: 100%;">
	<div class="wrapper" style="height: auto; min-height: 100%;">
		<header class="main-header">
			<a href="#" class="logo">
				<span class="logo-mini"><b>A</b>LT</span>
				<span class="logo-lg"><b>Admin</b>LTE</span>
			</a>
			<nav class="navbar navbar-static-top">
				<a href="#" class="sidebar-toggle" data-toggle="push-menu" role="button"><span class="sr-only">Toggle navigation</span></a>
				<div class="navbar-custom-menu">
					<ul class="nav navbar-nav">
						<li class="dropdown messages-menu">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-envelope-o"></i><span class="label label-success">4</span></a>
						</li>
						<li class="dropdown notifications-menu">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown"><i class="fa fa-bell-o"></i><span class="label label-warning">10</span></a>
						</li>
						<li class="dropdown user user-menu">
							<a href="#" class="dropdown-toggle" data-toggle="dropdown">
								<img th:src="@{/img/user2-160x160.jpg}" class="user-image" alt="User Image">
								<span class="hidden-xs">Alexander Pierce</span>
							</a>
							<ul class="dropdown-menu">
              					<li class="user-header">
                					<img th:src="@{/img/user2-160x160.jpg}" class="img-circle" alt="User Image">
                					<p>Alexander Pierce</p>
								</li>
								<li class="user-body">
              					</li>
								<li class="user-footer">
									<div class="pull-left"><a href="#" class="btn btn-default btn-flat" onclick="openIntrduce();">人物简介</a></div>
									<div class="pull-right"><a th:href="@{/a/logout}" class="btn btn-default btn-flat">登出</a></div>
								</li>
							</ul>							
						</li>
						<li>
							<a href="#" data-toggle="control-sidebar"><i class="fa fa-gears"></i></a>
						</li>
					</ul>
				</div>
			</nav>
		</header>
		<aside class="main-sidebar">
			<section class="sidebar" style="height: auto;">
                <ul class="nav" id="side-menu">
 					<li th:each="menu:${menus}">
                        <a href="#"><i th:class="${menu.icon}"></i><span class="nav-label" th:text="${menu.name}"></span><span class="fa arrow"></span></a>
                        <ul class="nav nav-second-level">
                        	<li th:each="cmenu:${menu.children}">
                        		<a th:href="@{${cmenu.href}}"><i th:class="${cmenu.icon}"></i><span class="nav-label2" th:text="${cmenu.name}"></span></a>
                        		<ul th:if="${!#lists.isEmpty(cmenu.children)}" class="nav nav-third-level second-nav">
                        			<li th:each="ccmenu:${cmenu.children}">
                        				<a th:href="@{${ccmenu.href}}"><i th:class="${ccmenu.icon}"></i><span class="nav-label2" th:text="${ccmenu.name}"></span></a>
                        			</li>
                        		</ul>
                        	</li>
                        </ul>
                    </li>
                </ul>				
			</section>
		</aside>
		<div class="content-wrapper" style="min-height: 960px;">
            <div id="page-wrapper" class="gray-bg dashbard-1" style="height: 100%;min-height: 960px;display: table;width: 100%;">
                <div id="page-tab">
                    <div class="tabpanel_left_scroll" id="page-prev"></div>
                    <nav id="page-tab-content"><div id="menu-list"></div></nav>
                    <div class="tabpanel_right_scroll" id="page-next"></div>
                </div>
                <div style="border-bottom: 1px solid #e5e5e5"></div>
                <div id="page-content"></div>
            </div>
		</div>
		<footer class="main-footer">
			<div class="pull-right hidden-xs"><b>Version</b> 2.4.0</div>
			<strong>Copyright © 2019-2020 <a href="">GGKB Studio</a>.</strong> All rights reserved.
		</footer>
	</div>

	<script th:src="@{/js/jquery.min.js}"></script>
	<script th:src="@{/js/bootstrap.min.js}"></script>
	<script th:src="@{/js/home.js}"></script>
	<script th:inline="javascript">var ctx = [[@{/}]];</script>
	<script th:src="@{/js/tab.js}"></script>
	<script th:src="@{/js/plugins/layer/layer.js}"></script>
	<script th:src="@{/js/plugins/metisMenu/jquery.metisMenu.js}"></script>
	<script type="text/javascript">
		$(function() {
			$('#side-menu').metisMenu(); // ul.nav#side-menu
			
			$("#side-menu a").tab();
		});
		
		function openIntrduce(){
		    layer.open({
		        type : 2,
		        title : '个人信息', 
		        offset: "80px",
		        maxmin : true,
		        shadeClose : false, // 点击遮罩关闭层
		        area : [ '800px', '540px' ],
		        content : ctx + 'a/user/introduction'
		    });
		}
	</script>
</body>
</html>